<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>热门活动</title>
		
		   <style>
      *{
        margin:0px;
        padding:0px;
    }
      li{
        list-style:none;
    }
      a{
        text-decoration:none;
    }
      img{
        vertical-align:center;
    }
      .clearfix:after{
        content:""
        display:table;
        clear:both;
    }
      .fl{
        float:left;
    }
      .fr{
        float:right;
    }
      .box{
        width:900px;
        margin:15px auto;
    }
      .box .biaoti{
        height:50px;
        margin-bottom:2px;
    }
      .box li:nth-of-type(1){
        float:left;
    }
      .box li:nth-of-type(3){
        float:left;
    }
      .box li p{
        font-size:15px;
    }
       .p1{
        margin-right:25px;
        margin-bottom:5px;
    }
    </style>

	</head>
	<body>
		<body>
    <div class="box">
      <div class="biaoti clearfix"> 
        <h3 class="fl">热门活动</h3>
        <p class="fr">更多</p>
      </div>
    <ul class="clearfix">
      <li class="p1"><img src="img/img1.png"/><a href="#"> <p></p>推荐活动 | 原创音乐现金榜T榜</a></li>
	  <li class="p1"><img src="img/img2.png"/><a href="#"> <p></p>推荐节目|《TAImusic》爆笑来袭</a></li>
       <li class="p1"><img src="img/img3.png"/><a href="#"> <p></p>推荐歌单 | 继续宠爱张国荣</a></li>
       <li class="p1"><img src="img/img4.png"/><a href="#"> <p></p>推荐活动| 330金属音乐巡演 成都小酒馆音乐空间</a></li>
    </ul>  
    </div>

	</body>
</html>
